<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
	<title></title>
	<style type="text/css">
.celula1 {
	background-color: #FFFAFA;
	color: black;
}
</style>
</h:head>
<h:body style="background-color: #F2F3F3;">
	<h:form id="form">
		<p:growl id="msgs" />
		<div align="center">
			<p:fieldset legend="Cronograma Físico - Financeiro:"
				toggleable="false" style="width:90%;font-size:12px;">

				<h:panelGrid id="pnCronograma"
					style="float: left;width:100%;font-size:12px;">
					<p:row>
						<p:column>
							<h:outputLabel value="Obra:"
								style="float: left; font-weight: bold;font-size:12px;" />
						</p:column>
					</p:row>
					<p:row>
						<p:column>
							<p:selectOneMenu
								style="float: left;width:200px; font-weight: bold;font-size:12px;"
								value="#{cronogramaBean.obraSelecionada}">
								<f:selectItems value="#{cronogramaBean.obrasSelect}" />
							</p:selectOneMenu>
						</p:column>
					</p:row>
					<p:row>
						<p:dataTable id="dtCronograma1" var="cronograma"
							style="width:150%;" value="#{cronogramaBean.listaCronograma}"
							scrollable="true" scrollWidth="1100px" editable="true"
							editMode="cell" widgetVar="cellCro"
							emptyMessage="Nenhum cadastro efetuado! ">

							<p:ajax event="cellEdit" listener="#{cronogramaBean.onCellEdit}"
								update=":form:msgs" />

							<p:columnGroup type="header">
								<p:row>
									<p:column width="3%" rowspan="3" />
									<p:column width="5%" rowspan="3" headerText="ITEM" />
									<p:column width="40%" rowspan="3"
										headerText="DISCRIMINAÇÃO DE SERVIÇOS" />
									<p:column width="10%" rowspan="3" headerText="PESO" />
									<p:column width="10%" rowspan="3" headerText="% EXECUTADO" />
									<p:column width="100%"
										colspan="#{cronogramaBean.listaPeriodo.size()}"
										headerText="PERÍODO:" />
								</p:row>

								<p:row>
									<ui:repeat value="#{cronogramaBean.listaPeriodo}" var="meses">
										<p:column colspan="1" headerText="#{meses.mes}" />
									</ui:repeat>
								</p:row>
								<p:row>
									<ui:repeat value="#{cronogramaBean.lista}" var="mesA">
										<p:column headerText="% MÊS - ( % ACUM )" />
									</ui:repeat>
								</p:row>
								<p:row>
									<p:column colspan="3" headerText="CONSOLIDADO" />
									<p:column headerText="#{cronogramaBean.pesoCount}%" />
									<p:column headerText="#{cronogramaBean.executadoCount}%" />
									<ui:repeat value="#{cronogramaBean.listaPeriodo}" var="meses">
										<p:column
											headerText="#{cronogramaBean.getConsolidadoCount(meses.id)}%" />
									</ui:repeat>
								</p:row>

							</p:columnGroup>

							<p:column>
								<p:commandLink update=":viewForm:viewDetail"
									action="#{cronogramaBean.buscarCronograma(cronograma.servico.id)}"
									oncomplete="PF('croDialog').show()">
									<h:graphicImage url="/templates/Imagens/icon_pencil.png" />

								</p:commandLink>

							</p:column>
							<p:column>
								<h:outputText value="#{cronograma.servico.id}" />
							</p:column>
							<p:column>
								<h:outputText value="#{cronograma.servico.nome}" />
							</p:column>
							<p:column>
								<h:outputText value="#{cronograma.servico.peso} %" />
							</p:column>
							<p:column>
								<h:outputText value="#{cronograma.servico.percExecutado} %" />
							</p:column>
							<p:columns colspan="1" var="meses" columnIndexVar="colIndex"
								value="#{cronogramaBean.listaPeriodo}">
								<h:outputText style="float: left;"
									value="#{cronogramaBean.getPercCount(meses.id, cronograma.servico.id)}% " />
								<h:outputText style="float: right;font-weight: bold;"
									value="( #{cronogramaBean.getAcumuladoCount(meses.id, cronograma.servico.id)}%   )" />
							</p:columns>
						</p:dataTable>
					</p:row>
				</h:panelGrid>
			</p:fieldset>
			<p />
		</div>
	</h:form>
	<h:form>
		<p:dialog width="70%" height="100%" header="Gerênciador de Serviços"
			widgetVar="janDialog" modal="true" showEffect="fade"
			hideEffect="fade" resizable="false">

			<p:outputPanel id="janDetail" style="float: center;text-align:left;">
				<p:fieldset legend="Serviço:" toggleable="false"
					style="float: center;width:95%;font-size:12px;">

					<h:inputHidden value="#{cronogramaBean.servicoSelecionado.id}" />
					<h:panelGrid columns="2" id="pnServicoEdit"
						style="float: center;width:100%">
						<p:row>
							<p:column>
								<h:outputLabel value="Obra:"
									style="float: left;width:40%; font-weight: bold;font-size:12px;" />
							</p:column>
							<p:column>
								<p:selectOneMenu value="#{cronogramaBean.obraSelecionada}"
									required="true">
									<f:selectItems value="#{cronogramaBean.obrasSelect}" />
								</p:selectOneMenu>
								<h:outputLabel value=" *"
									style="font-weight: bold;font-size:18px;color:red" />
							</p:column>
						</p:row>
						<p:row>
							<p:column>
								<h:outputLabel id="lblServico" value="Nome do Serviço:"
									style="float: left;width:40%; font-weight: bold;font-size:12px;" />
							</p:column>
							<p:column>
								<p:inputText id="txtServico" converter="toUpperCaseConverter"
									value="#{cronogramaBean.servicoSelecionado.nome}"
									required="true" requiredMessage=" *">
									<f:ajax event="blur" render="@this" />
								</p:inputText>
								<h:message for="txtServico" errorClass="errorMessage"
									style="font-weight: bold;font-size:18px;color:red" />
								<h:outputLabel value=" *"
									style="font-weight: bold;font-size:18px;color:red" />
							</p:column>
						</p:row>
						<p:row>
							<p:column>
								<h:outputLabel id="lblPeso" value="Peso:"
									style="float: left;width:40%; font-weight: bold;font-size:12px;" />
							</p:column>
							<p:column>
								<p:inputText id="txtPeso" required="true" requiredMessage=" *"
									value="#{cronogramaBean.servicoSelecionado.peso}" />
								<h:message for="txtPeso" errorClass="errorMessage"
									style="font-weight: bold;font-size:18px;color:red" />
								<h:outputLabel value=" *"
									style="font-weight: bold;font-size:18px;color:red" />
							</p:column>
						</p:row>
						<p:row>
							<p:column>
								<h:outputLabel id="lblPercExec" value="% Executado:"
									style="float: left;width:40%; font-weight: bold;font-size:12px;" />
							</p:column>
							<p:column>
								<p:inputText id="txtPercExec" required="false"
									value="#{cronogramaBean.servicoSelecionado.percExecutado}" />
							</p:column>
						</p:row>
					</h:panelGrid>
					<div align="right" style="margin-right: 4%">
						<p:commandButton value="Salvar" ajax="true" update=":form"
							action="#{cronogramaBean.salvarServico()}"
							oncomplete="handleLoginRequest(xhr, status, args)" />
					</div>
				</p:fieldset>
			</p:outputPanel>
		</p:dialog>
	</h:form>

	<h:form id="viewForm">
		<p:dialog width="70%" height="100%" id="viewDetail"
			header="Gerênciador de Cronogramas" widgetVar="croDialog"
			modal="true" showEffect="fade" hideEffect="fade" resizable="false">

			<p:outputPanel id="croDetail" style="float: center;text-align:left;">
				<p:fieldset legend="Cronograma:" toggleable="false"
					style="float: center;width:95%;font-size:12px;">

					<h:inputHidden value="#{cronogramaBean.cronogramaSelecionado.id}" />
					<h:panelGrid columns="2" id="pnCronogramaEdit"
						style="float: center;width:100%">
						<p:row>
							<p:column>
								ID: #{cronogramaBean.cronogramaSelecionado.id}
							</p:column>
						</p:row>
						<p:row>
							<p:column>
								OBRA: #{cronogramaBean.cronogramaSelecionado.obra.nome}
							</p:column>
						</p:row>
						<p:row>
							<p:column>
								SERVIÇO: #{cronogramaBean.cronogramaSelecionado.servico.nome}
							</p:column>
						</p:row>


					</h:panelGrid>
					<p:dataTable id="dtCro" editable="true" paginator="true"
						editMode="cell" value="#{cronogramaBean.listaCro}"
						var="cronograma" rows="5" style="font-size:12px;margin-top:10px"
						emptyMessage="Nenhum cadastro efetuado! ">

						<p:ajax event="cellEdit"
							listener="#{cronogramaBean.onCellEditCro}" update=":form" />

						<f:facet name="header">
							<h:outputText value="Lista de Cronogramas" />
						</f:facet>
						<p:column headerText="Mês:" style="font-size:12px;">
										#{cronograma.periodo.mes}
									</p:column>

						<p:column headerText="% Mês:" style="font-size:12px;">
							<p:cellEditor>
								<f:facet name="output">
									<h:outputText style="float: left;"
										value="#{cronograma.percMes}%" />
								</f:facet>
								<f:facet name="input">
									<p:inputText value="#{cronograma.percMes}" />
								</f:facet>
							</p:cellEditor>
						</p:column>

					</p:dataTable>

				</p:fieldset>
			</p:outputPanel>
		</p:dialog>
	</h:form>

	<script type="text/javascript">
    function handleLoginRequest(xhr, status, args) {
        if(args.validationFailed) {
            PF('janDialog').jq.effect("shake", {times:5}, 100);
        }
        else {
            PF('janDialog').hide();
            $('#loginLink').fadeOut();
        }
    }
</script>
</h:body>

</html>